<template>
  <div class="singer-song">
    <div v-for="(item, index) in list" :key="index">
      <h5>{{ item.name }}</h5>
      <span>{{ item.singer[0].name }}</span>
      <span>·</span>
      <span>{{ item.album.name }}</span>
      <span>·</span>
      <span>{{ item.album.subtitle }}</span>
    </div>
  </div>
</template>
<script>
export default {
  //通过props接收父组件传递的数据<SingerIntro :singeid='id'>
  props: ["singeid"],
  data() {
    return {
      list: [], //vant的list列表数据
      loading: false,
      finished: false,
      page: 1, //获取api数据的页码
    };
  },
  created() {
    this.onLoad();
  },
  methods: {
    getData() {
      this.$request(
        "get",
        "/singer/songs?singermid=" +
          this.singeid +
          "&page=" +
          this.page +
          "&num=20"
      ).then((res) => {
        this.list = this.list.concat(res.data.list);
        this.loading = false;
        this.page++;
        if (res.data.list.length == 0) {
          this.finished = true;
        }
        console.log(this.list);
      });
    },
    onLoad() {
      setTimeout(() => {
        this.getData();
        this.loading = true;
      }, 1000);
    },
  },
};
</script>
<style scoped>
</style>